﻿@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link href="~/Content/bootstrap/bootstrap.min.css" rel="stylesheet" />
    <link href="~/Content/css/font-awesome.min.css" rel="stylesheet" />
    <!--custom-->
    <link href="~/Content/css/index.css" rel="stylesheet" />
    <!--owl.carousel-->
    <link href="~/Content/css/owl.custom.css" rel="stylesheet" />
    <link href="~/Content/css/owl.carousel.css" rel="stylesheet" />
    <link href="~/Content/css/owl.theme.css" rel="stylesheet" />
    <link href="~/Content/css/style.css" rel="stylesheet" />
    <link href="~/Content/css/animate.css" rel="stylesheet" />
    <!--Magnific Popup-->
    <link href="~/Content/css/magnific-popup.css" rel="stylesheet" />
    <script src="~/Content/jquery/dist/jquery.min.js"></script>
    <script src="~/Content/bootstrap/bootstrap.min.js"></script>
    <script src="~/Content/js/wow.min.js"></script>
    <script src="~/Content/jquery/jquery.magnific-popup.js"></script>
    <script src="~/Content/js/owl.carousel.js"></script>
    <title>Index</title>
</head>
<body id="home">
    <div id="preloader">
        <div id="status"></div>
    </div>

    <!-- FullScreen -->
    <div class="intro-header">
        <div class="col-xs-12 text-center abcen1">
            <h1 class="h1_home wow fadeIn" data-wow-delay="0.4s">Dashboard</h1>
            <h3 class="h3_home wow fadeIn" data-wow-delay="0.6s">Clean & minimal Theme</h3>
            <ul class="list-inline intro-social-buttons">
                <li>
                    <a href="/Account/SignIn" class="btn  btn-lg mybutton_cyano wow fadeIn" data-wow-delay="0.8s"><span class="network-name">Sign In</span></a>
                </li>
            </ul>
        </div>
        <!-- /.container -->
        <div class="col-xs-12 text-center abcen wow fadeIn">
            <div class="button_down ">
                <a class="imgcircle wow bounceInUp" data-wow-duration="1.5s" href="#whatis"> <img class="img_scroll" src="~/Content/images/index/circle.png" alt=""> </a>
            </div>
        </div>
    </div>

    <!-- NavBar-->
    <nav class="navbar-default" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#home">Ttifa</a>
            </div>

            <div class="collapse navbar-collapse navbar-right navbar-ex1-collapse">
                <ul class="nav navbar-nav" id="navbar">
                    <li class="menuItem"><a href="#whatis">What is?</a></li>
                    <li class="menuItem"><a href="#useit">Use It</a></li>
                    <li class="menuItem"><a href="#screen">Screenshot</a></li>
                    <li class="menuItem"><a href="#credits">Credits</a></li>
                </ul>
            </div>

        </div>
    </nav>
    <div class="copyrights">Collect from <a href="http://www.cssmoban.com/">Ttifa Demo</a></div>
    <!--what is-->
    <div id="whatis" class="content-section-b" style="border-top: 0">
        <div class="container">

            <div class="col-md-6 col-md-offset-3 text-center wrap_title">
                <h2>What is?</h2>
                <p class="lead" style="margin-top:0">A special thanks to Death.</p>

            </div>

            <div class="row">

                <div class="col-sm-4 wow fadeInDown text-center">
                    <img class="rotate" src="/Content/images/icon/tweet.svg" alt="Generic placeholder image">
                    <h3>Follow Me</h3>
                    <p class="lead">Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. </p>

                    <!-- <p><a class="btn btn-embossed btn-primary view" role="button">View Details</a></p> -->
                </div><!-- /.col-lg-4 -->

                <div class="col-sm-4 wow fadeInDown text-center">
                    <img class="rotate" src="/Content/images/icon/picture.svg" alt="Generic placeholder image">
                    <h3>Gallery</h3>
                    <p class="lead">Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. </p>
                    <!-- <p><a class="btn btn-embossed btn-primary view" role="button">View Details</a></p> -->
                </div><!-- /.col-lg-4 -->

                <div class="col-sm-4 wow fadeInDown text-center">
                    <img class="rotate" src="/Content/images/icon/retina.svg" alt="Generic placeholder image">
                    <h3>Retina</h3>
                    <p class="lead">Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. </p>
                    <!-- <p><a class="btn btn-embossed btn-primary view" role="button">View Details</a></p> -->
                </div><!-- /.col-lg-4 -->

            </div><!-- /.row -->

            <div class="row tworow">

                <div class="col-sm-4  wow fadeInDown text-center">
                    <img class="rotate" src="/Content/images/icon/laptop.svg" alt="Generic placeholder image">
                    <h3>Responsive</h3>
                    <p class="lead">Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. </p>
                    <!-- <p><a class="btn btn-embossed btn-primary view" role="button">View Details</a></p> -->
                </div><!-- /.col-lg-4 -->

                <div class="col-sm-4 wow fadeInDown text-center">
                    <img class="rotate" src="/Content/images/icon/map.svg" alt="Generic placeholder image">
                    <h3>Google</h3>
                    <p class="lead">Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. </p>
                    <!-- <p><a class="btn btn-embossed btn-primary view" role="button">View Details</a></p> -->
                </div><!-- /.col-lg-4 -->

                <div class="col-sm-4 wow fadeInDown text-center">
                    <img class="rotate" src="/Content/images/icon/browser.svg" alt="Generic placeholder image">
                    <h3>Bootstrap</h3>
                    <p class="lead">Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. </p>
                    <!-- <p><a class="btn btn-embossed btn-primary view" role="button">View Details</a></p> -->
                </div><!-- /.col-lg-4 -->

            </div><!-- /.row -->
        </div>
    </div>

    <!-- Use it -->
    <div id="useit" class="content-section-a">

        <div class="container">

            <div class="row">

                <div class="col-sm-6 pull-right wow fadeInRightBig">
                    <img class="img-responsive " src="~/Content/images/index/ipad.png" alt="">
                </div>

                <div class="col-sm-6 wow fadeInLeftBig" data-animation-delay="200">
                    <h3 class="section-heading">Full Responsive</h3>
                    <div class="sub-title lead3">Lorem ipsum dolor sit atmet sit dolor greand fdanrh<br> sdfs sit atmet sit dolor greand fdanrh sdfs</div>
                    <p class="lead">
                        In his igitur partibus duabus nihil erat, quod Zeno commuta rest gestiret.
                        Sed virtutem ipsam inchoavit, nihil ampliusuma. Scien tiam pollicentur,
                        uam non erat mirum sapientiae lorem cupido
                        patria esse cariorem. Quae qui non vident, nihilamane umquam magnum ac cognitione.
                    </p>

                    <p>
                        <a class="btn btn-embossed btn-primary" href="#" role="button">View Details</a>
                        <a class="btn btn-embossed btn-info" href="#" role="button">Visit Website</a>
                    </p>
                </div>
            </div>
        </div>
        <!-- /.container -->
    </div>
    <div class="content-section-b">

        <div class="container">
            <div class="row">
                <div class="col-sm-6 wow fadeInLeftBig">
                    <div id="owl-demo-1" class="owl-carousel">
                        <a href="~/Content/images/index/iphone.png" class="image-link">
                            <div class="item">
                                <img class="img-responsive img-rounded" src="~/Content/images/index/iphone.png" alt="">
                            </div>
                        </a>
                        <a href="~/Content/images/index/iphone.png" class="image-link">
                            <div class="item">
                                <img class="img-responsive img-rounded" src="~/Content/images/index/iphone.png" alt="">
                            </div>
                        </a>
                    </div>
                </div>

                <div class="col-sm-6 wow fadeInRightBig" data-animation-delay="200">
                    <h3 class="section-heading">Drag Gallery</h3>
                    <div class="sub-title lead3">Lorem ipsum dolor sit atmet sit dolor greand fdanrh<br> sdfs sit atmet sit dolor greand fdanrh sdfs</div>
                    <p class="lead">
                        In his igitur partibus duabus nihil erat, quod Zeno commuta rest gestiret.
                        Sed virtutem ipsam inchoavit, nihil ampliusuma. Scien tiam pollicentur,
                        uam non erat mirum sapientiae lorem cupido
                        patria esse cariorem. Quae qui non vident, nihilamane umquam magnum ac cognitione.
                    </p>

                    <p>
                        <a class="btn btn-embossed btn-primary" href="#" role="button">View Details</a>
                        <a class="btn btn-embossed btn-info" href="#" role="button">Visit Website</a>
                    </p>
                </div>
            </div>
        </div>
    </div>

    <!-- Screenshot -->
    <div id="screen" class="content-section-b">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-md-offset-3 text-center wrap_title ">
                    <h2>Screen App</h2>
                    <p class="lead" style="margin-top:0">A special thanks to Death.</p>
                </div>
            </div>
            <div class="row wow bounceInUp">
                <div id="owl-demo" class="owl-carousel">

                    <a href="/Content/images/index/1.png" class="image-link">
                        <div class="item">
                            <img class="img-responsive img-rounded" src="/Content/images/index/1.png" alt="Owl Image">
                        </div>
                    </a>

                    <a href="/Content/images/index/2.png" class="image-link">
                        <div class="item">
                            <img class="img-responsive img-rounded" src="/Content/images/index/2.png" alt="Owl Image">
                        </div>
                    </a>

                    <a href="~/Content/images/index/3.png" class="image-link">
                        <div class="item">
                            <img class="img-responsive img-rounded" src="/Content/images/index/3.png" alt="Owl Image">
                        </div>
                    </a>

                    <a href="/Content/images/index/1.png" class="image-link">
                        <div class="item">
                            <img class="img-responsive img-rounded" src="/Content/images/index/1.png" alt="Owl Image">
                        </div>
                    </a>

                    <a href="/Content/images/index/2.png" class="image-link">
                        <div class="item">
                            <img class="img-responsive img-rounded" src="/Content/images/index/2.png" alt="Owl Image">
                        </div>
                    </a>

                    <a href="/Content/images/index/3.png" class="image-link">
                        <div class="item">
                            <img class="img-responsive img-rounded" src="/Content/images/index/3.png" alt="Owl Image">
                        </div>
                    </a>
                </div>
            </div>
        </div>


    </div>

    <!-- Credits -->
    <div id="credits" class="content-section-a">
        <div class="container">
            <div class="row">

                <div class="col-md-6 col-md-offset-3 text-center wrap_title">
                    <h2>Credits</h2>
                    <p class="lead" style="margin-top:0">A special thanks to Death.</p>
                </div>

                <div class="col-sm-6  block wow bounceIn">
                    <div class="row">
                        <div class="col-md-4 box-icon rotate">
                            <i class="fa fa-desktop fa-4x "> </i>
                        </div>
                        <div class="col-md-8 box-ct">
                            <h3> Bootstrap </h3>
                            <p> Lorem ipsum dolor sit ametconsectetur adipiscing elit. Suspendisse orci quam. </p>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 block wow bounceIn">
                    <div class="row">
                        <div class="col-md-4 box-icon rotate">
                            <i class="fa fa-picture-o fa-4x "> </i>
                        </div>
                        <div class="col-md-8 box-ct">
                            <h3> Owl-Carousel </h3>
                            <p> Nullam mo  arcu ac molestie scelerisqu vulputate, molestie ligula gravida, tempus ipsum.</p>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row tworow">
                <div class="col-sm-6  block wow bounceIn">
                    <div class="row">
                        <div class="col-md-4 box-icon rotate">
                            <i class="fa fa-magic fa-4x "> </i>
                        </div>
                        <div class="col-md-8 box-ct">
                            <h3> Codrops </h3>
                            <p> Lorem ipsum dolor sit ametconsectetur adipiscing elit. Suspendisse orci quam. </p>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 block wow bounceIn">
                    <div class="row">
                        <div class="col-md-4 box-icon rotate">
                            <i class="fa fa-heart fa-4x "> </i>
                        </div>
                        <div class="col-md-8 box-ct">
                            <h3> Lorem Ipsum</h3>
                            <p> Nullam mo  arcu ac molestie scelerisqu vulputate, molestie ligula gravida, tempus ipsum.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <footer>
        <div class="container">
            <div class="row">
                <div class="col-md-7">
                    <h3 class="footer-title">Follow Me!</h3>
                    <p>
                        Something Something Something?<br />
                        Visita Andrea Galanti.it e vedrai tutte le news riguardanti nuovi Theme!<br />
                    </p>

                    <!-- LICENSE -->
                    <a rel="cc:attributionURL" href="#"
                       property="dc:title">Flatfy Theme</a> by
                    <a rel="dc:creator" href="#"
                       property="cc:attributionName">Andrea Galanti</a>
                    is licensed to the public under
                    <BR>the <a rel="license"
                               href="#">
                        Creative
                        Commons Attribution 3.0 License - NOT COMMERCIAL
                    </a>.

                </div> <!-- /col-xs-7 -->

                <div class="col-md-5">
                    <div class="footer-banner">
                        <h3 class="footer-title">Flatfy Theme</h3>
                        <ul>
                            <li>12 Column Grid Bootstrap</li>
                            <li>Drag Gallery</li>
                            <li>Full Responsive</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!--固定导航栏-->
    <script src="~/Content/js/stickUp.min.js"></script>
    <script type="text/javascript">
        jQuery(function ($) {
            $(document).ready(function () {
                $('.navbar-default').stickUp();

            });
        });
    </script>
    <script>
        new WOW().init();//滚动动画
        $(window).load(function () {
            //Preloader
            $('#status').delay(300).fadeOut();
            $('#preloader').delay(300).fadeOut('slow');
            $('body').delay(550).css({ 'overflow': 'visible' });
        })

        $(document).ready(function () {
            //animated logo
            $(".navbar-brand").hover(function () {
                $(this).toggleClass("animated shake");
            });

            //animated scroll_arrow
            $(".img_scroll").hover(function () {
                $(this).toggleClass("animated infinite bounce");
            });

            //Wow Animation DISABLE FOR ANIMATION MOBILE/TABLET
            wow = new WOW(
            {
                mobile: false
            });
            wow.init();

            //MagnificPopup
            $('.image-link').magnificPopup({ type: 'image' });


            // OwlCarousel N1
            $("#owl-demo").owlCarousel({
                autoPlay: 3000,
                items: 3,
                itemsDesktop: [1199, 3],
                itemsDesktopSmall: [979, 3]
            });

            // OwlCarousel N2
            $("#owl-demo-1").owlCarousel({
                navigation: false, // Show next and prev buttons
                slideSpeed: 300,
                paginationSpeed: 400,
                singleItem: true
            });

            //SmothScroll
            $('#navbar a').click(function () {
                if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
                && location.hostname == this.hostname) {
                    var $target = $(this.hash);
                    $target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');
                    if ($target.length) {
                        var targetOffset = $target.offset().top;
                        $('html,body').animate({ scrollTop: targetOffset }, 600);
                        return false;
                    }
                }
            });

        });
    </script>
</body>
</html>
